<template>
  <div>
    <van-popup v-model="pickerShow" style="background-color: transparent" :close-on-click-overlay="false" position="bottom">
      <van-datetime-picker  type="year-month" :max-date="maxDate"
                           @change="onChange"   @cancel="onCancel" @confirm="onConfirm" />
    </van-popup>
  </div>
</template>

<script type="text/ecmascript-6">
  import Public from '@/assets/js/public';

  export default {
    /** kebab-case */
    name: 'picker-date-ym',

    data() {
      return {
        pickerShow: false,
        // currentDate: null,
        maxDate: new Date()
      };
    },
    /** 在声明 prop 的时候，其命名应该始终使用 camelCase，而在模板和 JSX 中应该始终使用 kebab-case。
     String/Number/Boolean/Function/Object/Array/Symbol */
    props: {},

    components: {},

    methods: {
      getIcon(icon) {
        return Public.ossImg + icon + '.svg';
      },
      show() {
        this.pickerShow = true;
      },
      dismiss() {
        this.pickerShow = false;
      },
      onChange(picker) {
      },
      onConfirm(val) {
        this.$emit('getDate', val);
        this.dismiss();
      },
      onCancel() {
        this.dismiss();
      }
    },
    computed: {},
    watch: {
      // 监听具体数据变化，并做相应的处理
    }
  };
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  @import "../../assets/stylus/main.styl";
  .flex-r
    flex-x()

  .flex-c
    flex-y()

  .center
    flex-center()

  .divider
    divider()

  .space
    space()
</style>
